 #{extends 'main.html' /} #{set title:'Home' /}

<!-- This HTML will show the tutorials under each relations,
 if there are no tutorials either at all or for any of the relations there will appear a message 
 saying that there are no tutorials yet -->
<html>
<body>
	<form action="@{Tutorials.browsRelations()}" method="get">
		#{ifnot relation}
		<p>
			<br> There are no relations yet.
		</p>
		#{/ifnot}

		<h1>Similar</h1>
		#{ifnot similar}
		<p>
			<br> There are no relations yet.

		</p>
		#{/ifnot} #{list items:similar , as:'similar'}

		<li><a href="/Tutorials/tutorialPage?tutId=${similar.id}">${similar.TutorialTitle.raw()}</a>
			>>>>>> ${similar.relatedTutTitle.raw()}</li> #{/list}


		<h1>Replace</h1>
		#{ifnot replace}
		<p>
			<br> There are no relations yet.

		</p>
		#{/ifnot} #{list items:replace , as:'replace'}
		<li><a href="/Tutorials/tutorialPage?tutId=${replace.id}">${replace.TutorialTitle.raw()}</a>
			>>>>>> ${replace.relatedTutTitle.raw()}</li> #{/list}

		<h1>Required To</h1>
		#{ifnot requiredTo}
		<p>
			<br> There are no relations yet.

		</p>
		#{/ifnot} #{list items:requiredTo , as:'requiredTo'}
		<li><a href="/Tutorials/tutorialPage?tutId=${requiredTo.id}">${requiredTo.TutorialTitle.raw()}</a>
			>>>>>> ${requiredTo.relatedTutTitle.raw()}</li> #{/list}

		<h1>Required For</h1>
		#{ifnot requiredFor}
		<p>
			<br> There are no relations yet.

		</p>
		#{/ifnot} #{list items:requiredFor , as:'requiredFor'}
		<li><a href="/Tutorials/tutorialPage?tutId=${requiredFor.id}">${requiredFor.TutorialTitle.raw()}</a>
			>>>>>> ${requiredFor.relatedTutTitle.raw()}</li> #{/list}

		<h1>part Of</h1>
		#{ifnot partOf}
		<p>
			<br> There are no relations yet.

		</p>
		#{/ifnot} #{list items:partOf , as:'partOf'}
		<li><a href="/Tutorials/tutorialPage?tutId=${partOf.id}">${partOf.TutorialTitle.raw()}</a>
			>>>>>> ${partOf.relatedTutTitle.raw()}</li> #{/list}
	</form>

</body>
</html>